//用于创建vuex中最为核心的store
//引入vue
import Vue from "vue";
//引入vuex
import Vuex from "vuex";

//使用vuex  注意大写 使用必须放在初始化实例前面,否则报错
Vue.use(Vuex);

import {list} from "../data.js";


//异步操作的在这里实现
const actions = {
   

};

//准备mutations用于操作数据(state)
const mutations = {
    //删除按钮,点击删除该项
    delOne(state,id){
        state.list = state.list.filter((item) => item.id !== id);
    },
    //切换全选与不选
    toggleAll(state,value){
        state.list.forEach((item) => {
            //这样list里面的每个的选中状态才会根据你传递过来的头部的全选按钮的状态变化
            item.select = value;
          });
    },
    //    //清空购物车
    clearAll(state){
        state.list =[];
    },
    //删除选中项
    delSelects(state){
         //千万记得重新赋值
        state.list = state.list.filter((item) => !item.select);

    }

};

//需要加工 使用配置项 getters
//用于逻辑和业务复杂时写进来
//state和getters 类似data和computed
const getters = {
  

   //商品数组长度
   totall(state){
    return state.list.length;
   },
   //被选中的商品数量
   selectNum(state){
    return state.list.reduce((item, prev) => (item += prev.select), 0);

   },



    //不管是总数量还是总价格，要计算的都是选中的
    //select为true
    //总数量
   //商品总数量
   totalNumber(state){
    return state.list
    .filter((item) => item.select)
    .reduce((item, prev) => (item += prev.buy_num), 0);

   },
   //总价格
   totalPri(state){
    return state.list
    .filter((item) => item.select)
    .reduce((item, prev) => (item += prev.buy_num * prev.price), 0);

   }
};


//准备state --应用于存放数据
const state = {
      list,

};





//创建一个store

// const store = new Vuex.Store({
//     actions,
//     mutations,
//     state,
// });

// //暴露store
// export default store
//可以简写为
export default new Vuex.Store({
    actions,
    mutations,
    state,
    getters,
})